<template>
    <div class="count">
        <h2>当前求和为：{{ s.sum }}</h2>
        <select name="" id="" style="margin-right: 10px;" v-model.number="n">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <button @click="addNum">加</button>
        <button @click="minus">减少</button>
    </div>
</template>

<script setup lang="ts" name="Count">

// 金博大佬开始学习计组了，我仿佛看到了一位巨人正在迷雾中显现出他的身影，
//他的学习之路就像一场冒险，充满了未知与挑战。在计算机组成原理的迷雾中，
//金博大佬似乎找到了前行的方向。每当他沉浸在代码和电路的世界中时，
//仿佛一座巨大的山峦正在逐渐显现，他脚下的路逐渐清晰起来。



import { ref } from 'vue'

import {useCountStore} from '@/store/count'

let s = useCountStore();

// let sum = ref(1)
let n = ref(1)


const addNum = ()=>{
    s.increment(n.value)
}

const minus = ()=>{
    s.jianshao(n.value)
}

</script>

<style scoped>
.count {
    background-color: aquamarine;
    box-shadow: 0 0 10px;
    border-radius: 10px;
    padding: 20px;
}

button {
    width: 80px;
    height: 30px;
    margin-right: 10px;
}
</style>